

<template>
<div>
  <h2>生命周期</h2>

  <ChildComponent v-if="isShowChild"></ChildComponent>

  <button @click="handleChange">切换</button>
</div>
</template>
<script setup lang="ts">
import ChildComponent from '@views/life-cycle/basic/ChildComponent.vue'

console.log('父组件-setup')

onBeforeMount(()=>{
  console.log('父组件-onBeforeMount')
})

onMounted(()=>{
  console.log('父组件-onMounted')
})

onUnmounted(()=>{
  console.log('父组件-onUnmounted')
})

const isShowChild = ref(true)
const handleChange = ()=>{
  isShowChild.value = !isShowChild.value
}

</script>
<style scoped>

</style>
